<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
	PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
	<title>Li Liang's Proxy - Log List</title>
	<style type='text/css'>
		* {
			font-family:calibri, verdana, Arial;
		}

		div.item-header span {
			font-weight:bold;
		}

		span.trace_id {
			display:inline-block;
			width:18em;
		}
		
		span.create_time {
			display:inline-block;
			width:15em;
		}
		
		span.host {
			display:inline-block;
			width:15em;
		}

		span.src_role {
			display:inline-block;
			width:5em;
		}
		
		span.dest_role {
			display:inline-block;
			width:5em;
		}
		
		div.item.border {
			border-top: 1px solid black;
			margin-top: 5px;
			padding-top: 5px;
		}
		
		form.filter {
			padding: 6px;
			background-color:lightblue;
			font-size:100%;
		}
	</style>
  </head>
  <body>
  	<form class='filter'>
		<label>File Ext. Filter:</label>
		<input id='filter-box' type="text" name='filter' value='{{filter}}' />
		<input type='submit' value='Submit'>
	</form>
	<div>
		<div class='item-header'>
			<span class='trace_id'>Trace Id</span>
			<span class='create_time'>Create Time</span>
			<span class='src_role'>Src Role</span>
			<span class='dest_role'>Dest Role</span>
			<span class='url'>Url</span>
		</div>
		{% for item in items %}
		<div class='item {% ifchanged item.trace_id %}border{% endifchanged %}'>
			<span class='trace_id'><a href='/log/show/{{item.key.id}}'>{{item.trace_id}}</a></span>
			<span class='create_time'>{{item.create_time}}</span>
			<span class='src_role'>{{item.src_role}}</span>
			<span class='dest_role'>{{item.dest_role}}</span>
			<span class='url'>{{item.url}}</span>
		</div>
		{% endfor %}
	</div>
	<script type='text/javascript'>
		document.getElementById('filter-box').focus();
	</script>
  </body>
</html>
